import React from "react";
import { Button, Form, Input } from "antd";
import { addProperty } from "../../../../../../store/reducer/propertylist";
import { useSelector, useDispatch } from "react-redux";
const SupportInfo = () => {
  // 仓库
  const dispatch = useDispatch();
  const pList = useSelector((state) => state.propertylist.pList);

  const onFinish = (values) => {
    console.log("Success:", values);
    dispatch(addProperty(values));
  };

  return (
    <div>
      <Form
        name="basic"
        labelCol={{
          span: 8,
        }}
        wrapperCol={{
          span: 16,
        }}
        style={{
          maxWidth: 600,
        }}
        initialValues={{
          remember: true,
        }}
        onFinish={onFinish}
        autoComplete="off"
      >
        <div style={{ display: "flex" }}>
          <div>
            <Form.Item label="建筑类型" name="buildType">
              <Input />
            </Form.Item>
          </div>
          <div>
            <Form.Item label="产权年限" name="termOfOwnership">
              <Input />
            </Form.Item>
          </div>
        </div>
        <div style={{ display: "flex" }}>
          <div>
            <Form.Item label="占地面积" name="floorSpace">
              <Input />
            </Form.Item>
          </div>
          <div>
            <Form.Item label="建筑面积" name="floorArea">
              <Input />
            </Form.Item>
          </div>
        </div>
        <div style={{ display: "flex" }}>
          <div>
            <Form.Item label="容积率" name="plotRatio">
              <Input />
            </Form.Item>
          </div>
          <div>
            <Form.Item label="绿化率" name="greeningRate">
              <Input />
            </Form.Item>
          </div>
        </div>
        <div style={{ display: "flex" }}>
          <div>
            <Form.Item label="规划户数" name="planHouseholds">
              <Input />
            </Form.Item>
          </div>
          <div>
            <Form.Item label="车位情况" name="parkingSituation">
              <Input />
            </Form.Item>
          </div>
        </div>
        <div style={{ display: "flex" }}>
          <div>
            <Form.Item label="物业类型" name="propertyType">
              <Input />
            </Form.Item>
          </div>
          <div>
            <Form.Item label="物业公司" name="propertyCompany">
              <Input />
            </Form.Item>
          </div>
        </div>
        <div style={{ display: "flex" }}>
          <Form.Item label="物业费" name="propertyFee">
            <Input />
          </Form.Item>
        </div>

        <div style={{ fontSize: "22px" }}>SEO优化</div>
        <div>
          <Form.Item label="SEO标题" name="seoTitle">
            <Input />
          </Form.Item>
        </div>
        <div>
          <Form.Item label="SEO标题" name="seoKeyword">
            <Input />
          </Form.Item>
        </div>
        <div>
          <Form.Item label="SEO描述" name="seoDescription">
            <textarea style={{ width: "500px", height: "100px" }}></textarea>
          </Form.Item>
        </div>
        <Form.Item
          wrapperCol={{
            offset: 8,
            span: 16,
          }}
        >
          <Button type="primary" htmlType="submit">
            提交
          </Button>
        </Form.Item>
      </Form>
    </div>
  );
};

export default SupportInfo;
